import { useUserStore } from '@/stores';
import { createRouter, createWebHistory } from 'vue-router'
// 导入进度条组件
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
import { getConsultOrderDetail } from '@/services/consult';
import { OrderType } from '@/enums';
// 关闭转圈效果
NProgress.configure({
  showSpinner: false
})

// 未支付状态
const isUnPay = async (orderId: string) => {
  const { data } = await getConsultOrderDetail(orderId as string)
  return data.status === OrderType.ConsultPay
}

const router = createRouter({
  // history路由模式，import.meta.env.BASE_URL代表读vite.config.ts中base这个基准地址作为路由前缀，方便一个域名可以运行多个不同项目
  history: createWebHistory(import.meta.env.BASE_URL),
  // 路由切换时，滚动条滚动到最顶部
  scrollBehavior: () => ({ top: 0 }),
  // history: createWebHistory(import.meta.env.BASE_URL),
  // 路由配置
  routes: [
    {
      path: '/',
      component: () => import('@/views/Layout/index.vue'),
      redirect: '/home',
      children: [
        { path: '/home', component: () => import('@/views/Home/index.vue'), meta: { title: '首页' } },
        { path: '/user', component: () => import('@/views/User/index.vue'), meta: { title: '个人中心' } },
        { path: '/notify', component: () => import('@/views/Notify/index.vue'), meta: { title: '消息通知' } },
        { path: '/article', component: () => import('@/views/Article/index.vue'), meta: { title: '健康百科' } }
      ]
    },
    { path: '/login', component: () => import('@/views/Login/index.vue'), meta: { title: '登录' } },
    { path: '/user/patient', component: () => import('@/views/User/patient/index.vue'), meta: { title: '家庭档案' } },
    // 极速问诊
    { path: '/consult/fast', component: () => import('@/views/Consult/ConsultFast.vue'), meta: { title: '极速问诊' } },
    // 诊室
    { path: '/consult/dep', component: () => import('@/views/Consult/ConsultDep.vue'), meta: { title: '选择科室' } },
    { path: '/consult/illness', component: () => import('@/views/Consult/ConsultIllness.vue'), meta: { title: '病情描述' } },
    { path: '/consult/pay', component: () => import('@/views/Consult/ConsultPay.vue'), meta: { title: '问诊支付' } },
    {
      path: '/room',
      component: () => import('@/views/Room/index.vue'),
      meta: { title: '问诊室' },
      // 路由组件前置守卫
      async beforeEnter(to) {
        // 如果支付返回状态为false,说明未支付成功，跳转到用户问诊记录页面，进行重新支付
        if (to.query.payResult === 'false') return '/user/consult'
        // 避免用户未支付订单，但是用户通过手动改支付状态为true的情况，最好还要使用订单号去查询订单状态稳妥
        const unPay = await isUnPay(to.query.orderId as string)
        if (unPay) return '/user/consult'
      }
    },
    { path: '/user/consult', component: () => import('@/views/User/ConsultOrder.vue'), meta: { title: '问诊订单' } },
    { path: '/user/consult/:id', component: () => import('@/views/User/ConsultOrderDetail.vue'), meta: { title: '问诊订单详情' } },
    { path: '/order/pay', component: () => import('@/views/Order/OrderPay.vue'), meta: { title: '药品支付' } },
    {
      path: '/order/pay/result',
      component: () => import('@/views/Order/OrderPayResult.vue'),
      meta: { title: '药品支付结果' }
    },
    {
      path: '/order/:id',
      component: () => import('@/views/Order/OrderDetail.vue'),
      meta: { title: '药品订单详情' }
    },
    {
      path: '/order/logistics/:id',
      component: () => import('@/views/Order/OrderLogistics.vue'),
      meta: { title: '物流详情' }
    },
    {
      path: '/login/callback',
      component: () => import('@/views/Login/LoginCallback.vue'),
      meta: { title: 'QQ登录-绑定手机' }
    }
  ]
})

// 路由前置导航守卫
router.beforeEach((to: { meta: { title: string; }; path: string; }) => {
  // 开启进度条
  NProgress.start()
  // 本项目除了登录、注册、第三方登录不需要token验证外，其他的路由都需要token验证
  const store = useUserStore()
  // 定义白名单
  const whiteList = ['/login', '/login/callback']
  if (!store.user?.token) {
    // 判断待访问的路由在不在白名单内
    if (whiteList.includes(to.path)) {
      return true
    }
    // 跳转到登录页
    return `/login?returnUrl=${to.path}`
  }
  // 不写或者return true代表放行
  // 如果当前访问是login,且有token,那么不应该再次去login页面，而是直接跳到个人中心
  if (to.path === '/login') {
    return '/user'
  }
  return true
})

// 路由后置导航守卫
router.afterEach((to: { meta: { title: string; } }) => {
  // 设置网页标题
  document.title = to.meta.title + '-优医问诊'
  // 关闭进度条
  NProgress.done()
})


export default router
